<template>
	<view class="bg">
		<view class="top">
			<view class="topDetails">
				<view class="homeImg">商</view>
				<view class="content">
					<view class="phone">{{userInfo.phone}}</view>
					<!-- <view class="phone">手机号：{{userInfo.phone}}</view> -->
				</view>
				<image src="../../static/tcdl.png" mode="" class="tc" @click.stop="tcdl"></image>
			</view>
			<u-sticky>
				<u-tabs :list="list" :is-scroll="false" :current="current" @change="change" :bar-width="130" height="90"
					active-color="#0062B6"></u-tabs>
			</u-sticky>
			<view style="margin-top: 10rpx;">
				<view class="contentList" v-if="dataList.length!=0">
					<view class="list" v-for="(item,index) in dataList" :key='index' @click="ddxx(item.detectionOrderId)">
						<view class="listTop">
							订单编号{{item.detectionOrderCode}}
							<view  v-if="item.orderState==6">
								<view class="listBottom">
									<view class="jxz  jxz2">退款中</view>
								</view>
							</view>
							<view   v-if="item.orderState==7">
								<view class="listBottom">
									<view class="jxz  jxz2">已退款</view>
								</view>
							</view>
						</view>
						<view class="listCenter">
							<!-- <image src="../../static/jctb.png" mode=""></image> -->
							<image :src="https+item.icon" mode=""></image>
							<view class="listCenterT">
								<view class="titles">{{item.reportName}} <text v-if="item.type==2"> (批量订单)</text></view>
								<view class="titlesBottom">
									<view>时间：{{item.createTime}}</view>
									<view class="money">¥{{item.totalAmount}}</view>
								</view>
							</view>
						</view>
						<view class="listDelBottom" v-if="item.orderState==2">
							<view></view>
							<view class="ksjc" @click.stop="ksjc(item.detectionOrderId)">开始检测</view>
						</view>
						<view class="listDelBottom" v-if="item.orderState==8">
							<view class="ddbh" style="opacity: 0;">订单编号：12312321312312321</view>
							<view class="ksjc" @click.stop="tyjd(item.detectionOrderId)">同意接单</view>
							<view class="ksjc" @click.stop="jjjd(item.detectionOrderId)" style="margin-left: 20rpx;">拒绝接单
							</view>
						</view>
						<view class="listDelBottom" v-if="item.orderState==3">
							<view></view>
							<view class="ksjc" @click.stop="bj(item.detectionOrderId)">编辑</view>
						</view>
						<view class="listDelBottom" v-if="item.orderState==4">
							<view></view>
							<view class="ksjc" @click.stop="ckbg(item.detectionOrderId)">查看报告</view>
						</view>
						<!-- <view class="listDelBottom" v-if="item.orderState==6">
							<view class="ddbh">订单编号：{{item.detectionOrderCode}}</view>
							<view class="ksjc1" >退款中</view>
						</view>
						
						<view class="listDelBottom" v-if="item.orderState==7">
							<view class="ddbh">订单编号：{{item.detectionOrderCode}}</view>
							<view class="ksjc1" >已退款</view>
						</view> -->
					</view>
					<view class="" style="padding: 30rpx 0;">
						<u-loadmore :status="status" :load-text="loadText" />
					</view>
				</view>
				<view v-else>
					<null></null>
				</view>
			</view>

		</view>

		<u-modal v-model="show" :content="content" show-cancel-button='true' @confirm='confirm()'></u-modal>
		<u-modal v-model="show1" :content="content1" show-cancel-button='true' @confirm='confirm2()'></u-modal>
		<u-toast ref="uToast" />

	</view>
</template>

<script>
	import API from "@/api/my.js"
	export default {
		data() {
			return {
				https: getApp().globalData.picturePath,
				userInfo: {
					nickName: "",
					avatarUrl: "",
					phone: uni.getStorageSync('phone')
				},
				show: false,
				content: '确定退出登录吗',
				show1: false,
				content1: '确定拒绝接单吗',
				list: [{
					name: '待接单',
					count: '0'
				}, {
					name: '待检测',
					count: '0'
				}, {
					name: '检测中',
				}, {
					name: '已完成',
				}, {
					name: '退款',
				}],
				current: 0,
				count: 0,
				dataList: '',
				page: 1,
				limit: 10,
				loadText: {
					loadmore: '轻轻上拉',
					loading: '努力加载中',
					nomore: '实在没有了'
				},
				status: 'loadmore',
				detectionOrderId:'',
				detectionCarReportId :""
			}
		},
		onLoad() {
			// this.getUserInfo();
			uni.hideHomeButton()
			this.detectionOrder()
		},
		onShow() {
			console.log(123)
			this.page = 1;
			uni.hideHomeButton()
			this.detectionOrder()
		},
		methods: {
			ddxx(detectionOrderId){
				console.log(detectionOrderId)
				uni.navigateTo({
					url: '/pagesC/orderDetails/orderDetails?detectionOrderId=' + detectionOrderId
				})
			},
			ckbg(detectionOrderId){
				uni.navigateTo({
					url: '/pagesC/carTestingList1/carTestingList1?detectionOrderId=' + detectionOrderId
				})
			},
			tyjd(detectionOrderId) {
				let data = {
					token: uni.getStorageSync('token'),
					detectionOrderId: detectionOrderId
				}
				API.merDetectionOrderOrderReceiving(data).then(res => {
					if (res.code == 200) {
						this.$refs.uToast.show({
							title: '接单成功',
							type: 'success',
						})
						this.detectionOrder()
					}else{
						this.$refs.uToast.show({
							title: '接单失败',
							type: 'error',
						})
					}
				})
			},
			jjjd(detectionOrderId){
				this.detectionOrderId = detectionOrderId
				this.show1 = true
			},
			onReachBottom() {
				let that = this;

				if (that.status == 'nomore') {
					return false;
				}
				this.status = 'loading';
				this.page = this.page + 1;
				let data = {
					token: uni.getStorageSync('token'),
					page: this.page,
					limit: this.limit,
					orderState: that.orderState
				}
				API.merDetectionOrderList(data).then(res => {
					this.dataList = this.dataList.concat(res.data);
				})
				console.log(this.count)
				if (this.page * this.limit >= this.count) {
					that.status = 'nomore';
				} else {
					that.status = 'loadmore';
				}
			},
			detectionOrder() {
				let that = this;
				console.log(that.current)
				if (that.current == 0) {
					that.orderState = '8'
				} else if (that.current == 1) {
					that.orderState = '2'
				} else if (that.current == 2) {
					that.orderState = '3'
				} else if (that.current == 3) {
					that.orderState = '4'
				}else{
					that.orderState = '7,6'
				}
				let data = {
					token: uni.getStorageSync('token'),
					page: this.page,
					limit: this.limit,
					orderState: that.orderState
				}
				API.merDetectionOrderList(data).then(res => {
					this.count = res.count;
					this.dataList = res.data;
					console.log(res)
					if (res.code == 200) {
						this.yjc()
						// if (that.current == 0) {
						// 	this.list[that.current].count = res.count;
						// 	this.yjc()
						// }
					}

				})
			},

			yjc() {
				let data = {
					token: uni.getStorageSync('token'),
					orderState: '2'
				}
				API.merDetectionOrderList(data).then(res => {
					console.log(res)
					this.list[1].count = res.count;
					this.yjc1();


				})
			},
			yjc1() {
				let data = {
					token: uni.getStorageSync('token'),
					orderState: '8'
				}
				API.merDetectionOrderList(data).then(res => {
					console.log(res)
					this.list[0].count = res.count;
			
			
				})
			},

			change(index) {
				this.current = index;
				this.page = 1;
				this.status = 'loadmore';
				this.detectionOrder();
			},
			confirm() {
				// let that = this;
				uni.clearStorage()
				uni.reLaunch({
					url: '/pages/loginBtn/loginBtn'
				});

			},
			confirm2() {
				let data = {
					token: uni.getStorageSync('token'),
					detectionOrderId: this.detectionOrderId
				}
				API.merDetectionOrderUnorderReceiving(data).then(res => {
					if (res.code == 200) {
						this.$refs.uToast.show({
							title: '操作成功',
							type: 'success',
						})
						this.detectionOrder()
					}else{
						this.$refs.uToast.show({
							title: '操作失败',
							type: 'error',
						})
					}
				})
			},
			ksjc(detectionOrderId) {
				let data = {
					token: uni.getStorageSync('token'),
					detectionOrderId: detectionOrderId
				}
				API.merDetectionOrderStartTesting(data).then(res => {
					if (res.code == 200) {
						uni.navigateTo({
							url: '/pagesC/carTestingList/carTestingList?detectionOrderId=' + detectionOrderId
						})
					}
				})
				
			},
			bj(detectionOrderId){
				let data  = {
					token:uni.getStorageSync('token'),
					detectionOrderId:detectionOrderId
				}
				API.merDetectionOrderGetAllCarReport(data).then(res=>{
					this.detectionCarReportId = res.data[0].detectionCarReportId;
					console.log("detectionCarReportId:"+this.detectionCarReportId)
					
					uni.navigateTo({
						// url: '/pagesC/carTestingList/carTestingList?detectionOrderId=' + detectionOrderId+"&detectionCarReportId="+this.detectionCarReportId
						url: '/pagesC/testingList/testingList?detectionCarReportId='+this.detectionCarReportId+'&detectionOrderId='+detectionOrderId
					})
				})
				
				
			},
			//退出登录
			tcdl() {
				this.show = true;
				console.log(123)
			},

		}
	}
</script>

<style lang="scss">
	.tc {
		width: 31rpx;
		height: 32rpx;
		/* text-align: right; */
		position: absolute;
		right: 70rpx;
		top: 65rpx;
	}

	.tcdl {
		width: 368rpx;
		height: 80rpx;
		text-align: center;
		line-height: 80rpx;
		margin: auto;
		font-size: 30rpx;
		border-radius: 4rpx;
		background: #dd4835;
		color: #fff;
		position: absolute;
		bottom: 182rpx;
		left: 191rpx
	}

	.wdxx {
		position: relative;
	}

	.wdxx1 {
		position: absolute;
		font-size: 25rpx;
		color: #fff;
		background: #FD7E6E;
		width: 40rpx;
		height: 40rpx;
		text-align: center;
		line-height: 40rpx;
		border-radius: 50%;
	}

	.typeImg {
		width: 100%;
		height: 177rpx;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		padding: 0 45rpx 35rpx 45rpx;

		view {
			width: 25%;
			height: 157rpx;
			// background: #000;
			margin-top: 36rpx;

			.imgss {
				width: 98rpx;
				height: 98rpx;
				border-radius: 50%;
				display: block;
				margin: auto;
			}

			text {
				font-size: 24rpx;
				color: #2C2C2C;
				text-align: center;
				display: block;
				margin: auto;
				margin-top: 10rpx;
			}
		}
	}

	.titles {
		font-family: PingFangSC-Medium;
		font-size: 36rpx;
		color: #2C2C2C;
		font-weight: 500;
	}

	.top {
		width: 750rpx;
		height: 156rpx;
		background-color: #fff;

		.topDetails {
			display: flex;
			padding: 32rpx;

			.content {
				margin-left: 24rpx;
				font-size: 32rpx;
			}

			.phone {
				margin-top: 30rpx;
				margin-left: 20rpx;
				font-size: 34rpx;
				color: #333333;
				letter-spacing: 1.2rpx;
			}
		}

		.homeImg {
			width: 100rpx;
			height: 100rpx;
			border-radius: 50%;
			overflow: hidden;
			color: #fff;
			text-align: center;
			line-height: 100rpx;
			background-image: linear-gradient(90deg, #10A098 0%, #0062B6 100%);
			font-size: 38rpx;
		}

		.wd {
			margin-left: 160rpx;
			margin-top: 40rpx;

			image {
				width: 12rpx;
				height: 20rpx;

			}
		}
	}

	.wdType {
		padding: 32rpx 114rpx;
		background: #fff;
		display: flex;
		justify-content: space-between;
	}

	.wdType1 {
		padding: 32rpx;
		background: #fff;
		margin-top: 7rpx;
	}

	.wdTypeL {
		border-right: 1px solid #EFEFEF;
		;
	}

	.wdTypeR {
		padding-left: 40rpx;
	}

	.wdTypeL,
	.wdTypeR {
		width: 260rpx;
		height: 90rpx;
		display: flex;
		line-height: 90rpx;
		font-size: 28rpx;
		color: #2C2C2C;

		image {
			width: 46rpx;
			height: 46rpx;
			margin-top: 20rpx;
			margin-right: 28rpx;
		}
	}

	.list {
		// margin-top: 7rpx;
		margin: 14rpx 0;
		border-radius: 8rpx;
	}

	.list {
		padding: 0 32rpx;
		background: #fff;

	}

	.listTop {
		width: 100%;
		height: 100rpx;
		line-height: 100rpx;
		font-size: 28rpx;
		color: #4F4F4F;
		border-bottom: 1px solid #EFEFEF;
		display: flex;
		justify-content: space-between;
	}

	.listCenter {
		display: flex;
		padding: 34rpx 0 43rpx;
		border-bottom: 1px solid #EFEFEF;

		image {
			width: 95rpx;
			height: 81rpx;
		}
	}

	.listCenterT {
		margin-left: 42rpx;
		width: 600rpx;
	}

	.titles {
		font-size: 30rpx;
		font-family: PingFangSC-Medium;
		color: #2C2C2C;

	}

	.titlesBottom {
		display: flex;
		justify-content: space-between;
		margin-top: 12rpx;
		font-size: 28rpx;
		color: #4F4F4F;
	}

	.money {
		font-family: PingFangSC-Medium;
		font-size: 34rpx;
		color: #FF552E;
	}

	.fk {
		background: #0062B6;
		width: 136rpx;
		height: 68rpx;
		font-size: 28rpx;
		color: #FFFFFF;
		line-height: 68rpx;
		text-align: center;
		border-radius: 4rpx;
		margin-top: 12rpx;
		margin-left: 40rpx;
	}

	.ckbg {
		background: #FD7E6E;
		width: 136rpx;
		height: 68rpx;
		font-size: 28rpx;
		color: #FFFFFF;
		line-height: 68rpx;
		text-align: center;
		border-radius: 4rpx;
		margin-top: 12rpx;
		margin-left: 40rpx;
	}

	.listBottom {
		height: 100rpx;
		line-height: 100rpx;
		display: flex;
		float: right;
		font-size: 28rpx;
	}

	.listDelBottom {
		padding-top: 20rpx;
		line-height: 60rpx;
		display: flex;
		justify-content: space-between;
	}

	.jxz {
		font-size: 28rpx;
		color: #42C7E6;
		text-align: center;
	}

	.ksjc {
		width: 146rpx;
		height: 58rpx;
		line-height: 58rpx;
		text-align: center;
		font-size: 24rpx;
		color: #FFFFFF;
		background-image: linear-gradient(90deg, #10A098 0%, #0062B6 100%);
		border-radius: 34rpx;
		margin-bottom: 10rpx;
	}
	.ksjc1 {
		width: 146rpx;
		height: 58rpx;
		line-height: 58rpx;
		text-align: center;
		font-size: 24rpx;
		border-radius: 34rpx;
		margin-bottom: 10rpx;
	}
	

	.ddbh {
		font-size: 24rpx;
		color: #999999;
	}
</style>
